<template>
  <div class="list-query-con">
    <el-form
      :inline="true"
      :model="formData"
      label-position="left"
      label-width="0"
      class="tb-form-inline"
    >
      <el-form-item label="" :style="{ width: '1.4rem' }">
        <el-input v-model="formData.timeCount" placeholder="请输入"></el-input>
      </el-form-item>
      <el-form-item label="" :style="{ width: '2rem' }">
        <el-select v-model="formData.timeType" placeholder="请选择">
          <el-option label="天" value="DAY"></el-option>
          <el-option label="月" value="MONTH"></el-option>
          <el-option label="年" value="YEAR"></el-option>
        </el-select>
      </el-form-item>

      <!-- <el-form-item>
        <el-button type="info" @click="onSubmit">
          重置
        </el-button>
        <el-button type="primary" @click="onSubmit">
          查询
        </el-button>
      </el-form-item> -->
      <!-- <el-form-item>
        <el-button
          type="primary"
          style="width: 1.4rem; height: 0.48rem"
          icon="el-icon-plus"
          >新增任务</el-button
        >
      </el-form-item> -->
    </el-form>
  </div>
</template>
  
<script>
export default {
  props: ["taskData"],
  components: {},
  computed: {},
  data: () => {
    return {
      formData: {
        timeCount: "",
        timeType: "",
      },
    };
  },
  mounted() {
    this.formData = {
      timeCount: this.taskData.intProp1,
      timeType: this.taskData.strProp1,
    };
  },
  watch: {
    taskData: {
      handler(newVal, oldVal) {
        this.formData = {
          timeCount: newVal.intProp1,
          timeType: newVal.strProp1,
        };
      },
      deep: true,
    },
  },
  methods: {
    onSubmit() {
      console.log("submit!");
    },
  },
};
</script>
  
  <style lang="less" scoped>
@formheight: 0.36rem;
.list-query-con {
  display: block;
  height: @formheight;
  .tb-form-inline {
    text-align: left;
    height: @formheight; /* 设置 Form 高度 */
    :deep(.el-input__inner),
    :deep(.el-form-item__label),
    :deep(.el-form-item__content) {
      height: @formheight;
      line-height: @formheight;
      font-family: SourceHanSansCN;
      font-weight: 400;
      font-size: 0.18rem;
    }
    :deep(.el-button) {
      width: 1rem;
      height: @formheight;
      line-height: @formheight;
      padding: 0;
    }

    :deep(.el-form-item__label) {
      float: left !important;
    }
    :deep(.el-button--primary) {
      background: linear-gradient(90deg, #3364fe 0%, #5f9afe 100%);
      border-radius: 0.04rem;
      border-color: transparent;
    }
  }
}
</style>
  